<template>
  <a-spin :spinning="spinning">
  <base-breadcrumb :breadcrumb="!isAudit">
    <a-card :bordered="false">
      <title-name title="双优化立项申请表" />
      <a-form-model ref="form1" layout="horizontal" :model="form" :rules="rules">
        <a-row :gutter="24">
          <a-col :md="16" :sm="16">
            <a-form-model-item label="所属单位" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="projectId">
              <BaseInput v-model="form.viewName" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="双优化立项编号" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="optimizationNum">
              <BaseInput v-model="form.optimizationNum" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="项目业态" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="_projectFormatName">
              <BaseInput v-model="form._projectFormatName" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="项目设计管理类别" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="_designName">
              <BaseInput v-model="form._designName" disabled />
            </a-form-model-item>
          </a-col>
        </a-row>

        <a-row :gutter="24">
          <a-col :md="16" :sm="16">
            <a-form-model-item label="双优化立项名称" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="optimizationName">
              <BaseInput v-model="form.optimizationName" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="分类" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="typeId">
              <BaseInput v-model="form.typeName" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :md="8" :sm="8">
            <a-form-model-item label="详细分类" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="classification">
              <BaseInput v-model="form.classificationName" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="设计阶段" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="_designStageName">
              <BaseInput v-model="form._designStageName" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="优化类别" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="_optimizeStageName">
              <BaseInput v-model="form._optimizeStageName" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="工程类别" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="projectType">
              <BaseInput v-model="form.projectType" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="分部" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="part">
              <BaseInput v-model="form.part" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="创新" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="isNew">
              <a-radio-group v-model="form.isNew" disabled>
                <a-radio :value="1">是</a-radio>
                <a-radio :value="0">否</a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="提出人" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="proposer">
              <BaseInput v-model="form.proposer" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="拟实施人" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="implementer">
              <BaseInput v-model="form.implementer" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="立项效益(万)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="forecastBenefit">
              <BaseInput v-model="form.forecastBenefit" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :md="8" :sm="8">
            <a-form-model-item label="计划实施时间" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="startTime">
              <BaseInput v-model="form.startTime" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="计划结束时间" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="endTime">
              <BaseInput v-model="form.endTime" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="专业类别" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }" prop="majorCategory">
              <a-select v-model="form.majorCategory" disabled>
                <a-select-option :value="0">
                  建筑
                </a-select-option>
                <a-select-option :value="1">
                  机电
                </a-select-option>
                <a-select-option :value="2">
                  结构
                </a-select-option>
                <a-select-option :value="3">
                  市政景观
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :md="8" :sm="8">
            <a-form-model-item label="创建人" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
              <BaseInput v-model="form.creater" placeholder="" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-model-item label="创建时间" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }" :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
              <BaseInput v-model="form.createdTime" disabled />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :md="24" :sm="24">
            <a-form-model-item label="内容概述" :label-col="{ lg: { span: 2 }, sm: { span: 2 } }" :wrapper-col="{ lg: { span: 22 }, sm: { span: 22 } }">
              <editor v-model="form.contentDels" disabled :is-clear="true" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :md="24" :sm="24">
            <a-form-model-item label="预计优化效益测算依据" :label-col="{ lg: { span: 2 }, sm: { span: 2 } }" :wrapper-col="{ lg: { span: 22 }, sm: { span: 22 } }" prop="calculationBasis">
              <BaseTextarea v-model="form.calculationBasis" :auto-size="{ minRows: 20, maxRows: 25 }" :max-length="3000" disabled placeholder="请输入" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>

      <title-name title="上传相关附件" />

      <a-table bordered :columns="columnAssment" :data-source="data" style="padding-bottom: 20px">
        <span slot="serial" slot-scope="text, record, index">{{ index + 1 }}</span>
        <span slot="action" slot-scope="text, record, index">
          <a :href="'/api/ycloud-file-center/oper/download?access_token=' + token + '&fileId=' + record.fileId" target="_parent">导出</a>
          <a-divider type="vertical" /> <a :key="record.fileId" @click="$filePreview(record)">查看</a>
        </span>
      </a-table>
    </a-card>

    <div v-if="!isConsultation" class="page-btn-right-top">
      <a-button type="primary" @click="goBack">
        关闭
      </a-button>
    </div>
  </base-breadcrumb>
  </a-spin>
</template>

<script>
import Vue from 'vue'
import { getOptimizationDetails } from '@/api/project/optimization'
import { getProjectsDel } from '@/api/project/projects'
import editor from '@/components/Editor/editor'
import ARow from 'ant-design-vue/es/grid/Row'

const columns = [
  {
    title: '序号',
    width: 65,
    dataIndex: 'serial',

    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '双优化立项计划项名称',
    dataIndex: 'name',
    width: '20%'
  },
  {
    title: '类型',
    dataIndex: 'category',
    width: '10%'
  },
  {
    title: '详细分类',
    dataIndex: 'detailedCategory',
    width: '15%'
  },
  {
    title: '项目',
    dataIndex: 'projectName',
    width: '20%'
  },
  {
    title: '分公司',
    dataIndex: 'branchOffice',
    width: '10%'
  },
  {
    title: '立项情况',
    dataIndex: '',
    width: '15%'
  }
]

const columnAssment = [
  {
    title: '序号',
    width: 65,
    dataIndex: 'serial',

    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '附件名称',
    dataIndex: 'fileName',
    width: '15%'
  },
  {
    title: '附件格式',
    dataIndex: 'suffixName',
    width: '15%'
  },
  // {
  //   title: '附件地址',
  //   dataIndex: 'rootPath',
  //   width: '40%'
  // },
  {
    title: '操作',
    key: 'action',
    width: '20%',
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  name: 'a' + Date.now(),
  components: {
    ARow,
    editor
  },
  props: {
    // 是否作为审批详情
    isAudit: {
      type: Boolean,
      default: false
    },
    // 是否作为意见征询
    isConsultation: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      columns,
      columnAssment,
      treeCheckabel: true, // 是否多选

      objFrom: {
        pageSize: 10,
        pageNum: 1,
        query: {}
      },

      data: [],
      dataSource: [],

      optimizationTypes: [], // 优化类型
      detailedClassification: [], // 详细分类

      visible: false,
      title: '选择双优化立项计划项',

      form: {
        creater: JSON.parse(sessionStorage.getItem('ycloud-user_info')).name,
        increaseBenefit: '',
        reduceBenefit: '',
        forecastBenefit: '',
        createdTime: '',
        viewName: ''
      },
      currentDate: '', // 当前日期

      selectedRowKeys: [],
      selectedRows: [],

      isEdit: '',
      id: '',

      companys: [],
      projectNames: [],
      projectType: '',
      token: '',
      type: '',
      spinning: false,
      rules: {
        projectId: [{ required: true, message: '请选择项目', trigger: 'blur' }],
        // optimizationNum: [{ required: true, message: '请输入双优化立项编号', trigger: 'blur' }],
        optimizationName: [{ required: true, message: '请输入双优化立项名称', trigger: 'blur' }],
        typeId: [{ required: true, message: '请选择优化类型', trigger: 'blur' }],
        classification: [{ required: true, message: '请选择详细分类', trigger: 'blur' }],
        proposer: [{ required: true, message: '请选择提出人', trigger: 'blur' }],
        implementer: [{ required: true, message: '请选择拟实施人', trigger: 'blur' }],
        reduceBenefit: [{ required: true, message: '请输入预测减亏效益', trigger: 'blur' }],
        increaseBenefit: [{ required: true, message: '请输入预计增加效益', trigger: 'blur' }],
        startTime: [{ required: true, message: '请选择计划实施时间', trigger: 'change' }],
        endTime: [{ required: true, message: '请选择计划结束时间', trigger: 'change' }]
      }
    }
  },

  created() {
    this.id = this.$route.query.id
    this.type = this.$route.query.type
    this.token = Vue.getAcloudProvider().getAccessToken()
    this.getOptimizationDetails()

    this.getCurrentDate() // 获取当前日期
  },

  computed: {
    rowSelection() {
      return {
        type: 'radio',
        selectedRowKeys: this.selectedRowKeys,
        selectedRows: this.selectedRows, // 当前行所有数据
        onChange: this.onSelectChange
      }
    }
  },
  methods: {
    getProjectInfo(info) {
      this.form._projectFormatName = info.projectFormatName?.join(',')
      this.form._designName = info.designName
    },
    getCurrentDate() {
      var d1 = new Date()
      var year = d1.getFullYear() //年
      var month = d1.getMonth() + 1 //月
      var day = d1.getDate() //日

      if (month < 10) {
        month = '0' + month
      }
      if (day < 10) {
        day = '0' + day
      }
      this.form.createdTime = year + '-' + month + '-' + day
    },

    goBack() {
      if (this.type == 'approve') {
        window.close()
      } else {
        this.$multiTab.close(this.$route.fullpath)
      }
    },

    getOptimizationDetails() {
      this.spinning =true
      getOptimizationDetails({ id: this.id }).then(res => {
        this.spinning = false
        this.form = {
          ...res.data,
          _projectFormatName: null,
          _designName: null,
          viewName: res.data.branch + '/' + res.data.projectName,
          forecastBenefit: res.data.forecastBenefit ?? Number(res.data.forecastBenefit),
          _designStageName: res.data.designStage,
          _optimizeStageName: res.data.optimizeStage
        }
        // 根据【所属单位】，查询【项目业态】【项目设计管理类别】（这两个字段不存入后端，因此需要前端自己查询）
        getProjectsDel({ projectId: res.data.projectId }).then(res2 => {
          this.form._projectFormatName = res2.data.projectFormatName?.join(',')
          this.form._designName = res2.data.designName
        })
        if (this.form.typeId == 111) {
          this.form.typeName = '设计优化'
        } else if (this.form.typeId == 222) {
          this.form.typeName = '施工组织设计(方案)优化'
        }
        // this.form.forecastBenefit = parseFloat(
        //   parseFloat(this.form.increaseBenefit) + parseFloat(this.form.reduceBenefit)
        // ).toFixed(2)

        this.data = res.data.fileIdsInfo
      })
    }
  }
}
</script>
